{% extends 'back/index.html' %}

{% block content %}
    <div class="modal fade" id="delWarningmodal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <input id="delid" type="hidden" value="0">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <h4 class="modal-title"><i class="fa fa-warning"></i>警告！</h4>
                </div>
                <div class="modal-body">
                    确定要删除此商品吗？（此操作不可恢复）
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn default" data-dismiss="modal">取消</button>
                    <button type="button" onclick="del()" class="btn red">删除</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

     <div class="rt_content">
         <div class="page_title">
             <h2 class="fl">会员列表</h2>
             <a href="{% url 'user_add' %}" class="fr top_rt_btn add_icon">添加新会员</a>
         </div>
		 <script type="text/javascript">
            jQuery(document).ready(function ($) {
                $("#example-1").dataTable({
                    aLengthMenu: [
                        [10, 25, 50, 100, -1], [10, 25, 50, 100, "全部"]
                    ],
                    language: {
                        "info": "显示_START_至_END_项结果，共_TOTAL_项",
                        "search": "搜索:",
                        "paginate": {"previous": "上一页", "next": "下一页"},
                        "lengthMenu": "显示 _MENU_ 项",
                        "zeroRecords": "抱歉，没有找到符合条件的记录"
                    }
                });
                $("#example-1").wrapAll("<div style='overflow-x:scroll'>");
            });
        </script>
		 
		<table id="example-1" class="table table-striped table-bordered" cellspacing="0" width="80%"
               style="white-space: nowrap;">
            <thead>
            <tr>
                <th>Id</th>
                <th>会员头像</th>
                <th>会员名称</th>
                <th>手机号码</th>
                <th>电子邮件</th>
                <th>会员等级</th>
                <th>会员权限</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            {% for u in users %}
                <tr id = "{{ u.id }}">
                    <td class="center">{{ u.id }}</td>
                    <td class="center"><img src="{{ u.user_profile }}" width="50" height="50"/></td>
                    <td class="center">{{ u.username }}</td>
                    <td class="center">{{ u.phone }}</td>
                    <td class="center">{{ u.email }}</td>
                    <td class="center">{{ u.grade }}</td>
                    {% if u.role == 1 %}
                        <td class="center">管理员</td>
                    {% else %}
                        <td class="center">普通用户</td>
                    {% endif %}

                    <td class="center">
                        <a href="{% url 'user_detail' %}?id={{ u.id }}" title="查看详情" class="link_icon"
                           >&#118;</a>
                        <!--<a href="product_detail.html" title="编辑" class="link_icon">&#101;</a>-->
                        <a href="#"
                           onclick="delwarn(this)" title="删除" class="link_icon">&#100;</a>
                    </td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
    <script type="text/javascript">

        function delwarn(aa) {
            var id = $(aa).parents('tr').attr('id');
            $('#delid').val(id);
            $('#delWarningmodal').modal();
        }

        function del() {
            var id = $('#delid').val();
            $.ajax({
                url: '/user_delete/',
                type: 'POST',
                data: {'id':id},
                dataType: 'json',
                timeout: 10000,
                success: function (data) {
                    if (data == "success") {
                        $('#delWarningmodal').modal('hide');
                        location.reload();
                    } else {
                        alert('删除未成功！')
                    }
                }
            })
        }

        (function ($) {
            $(window).load(function () {
                $('#drop3').collapse('show');
                $('#3-1').addClass('active');
            });
        })(jQuery);
    </script>
{% endblock %}